import { CloseCircleOutlined, UploadOutlined } from '@ant-design/icons'
import {
  Button,
  Card,
  Col,
  DatePicker,
  Form,
  Input,
  Popover,
  Row,
  Select,
  TreeSelect,
  Spin,
  Upload
} from 'antd'
import React, { useEffect, useState } from 'react'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { connect, history } from 'umi'
import EducationTableForm from './components/EducationTableForm'
import SocietyTableForm from './components/SocietyTableForm'
import InOrgNameTableForm from './components/InOrgNameTableForm'
import FamilyTableForm from './components/FamilyTableForm'
import FooterToolbar from './components/FooterToolbar'
import RelativeRecords from './components/RelativeRecords'
import InternalAwardTable from './components/InternalAwardTable'
import moment from 'moment'
import styles from './style.less'
import {getProfessionstyle} from '@/services/service';

import './index.less'
import {
  genderList,
  maritalList,
  socialTraineeStateArray,
  nationList,
  regionList,
  healthsList,
  yesOrNoList,
  yesOrNoIntList,
  inOrgList,
  jobLevelTypeList,
  channelList,
  probationDayList, employeeTypeList,
  websiteList,laborContractYearsList,positionStarList
} from '@/utils/constant'
import { getEmployeeById, getJobByOrgId, getNativeplace, findTiaoxinTixiByJobId } from '@/pages/Info/service'
import { findItemByTree } from '@/utils/functions';
import {getUploadUrl} from "@/utils/upload";
const { Option } = Select

const FormItem = Form.Item

const colStyle = {
  xl: {
    span: 6,
    offset: 1,
  },
  lg: 8,
  md: 12,
  sm: 24,
  xs: 24,
}

const Edit = ({ submitting, dispatch, match, infoAndEdit = {}, infoModel, currentUser }) => {

  const { options = {} } = infoModel
  const { orgTree = [], orgLine = [], orgSystem = [], jobLevel = [] } = options
  let { info } = infoAndEdit
  const { employeeId } = match.params
  const { authorities } = currentUser;
  const editAllInfo = authorities.indexOf("user:info:editall") > -1;
  const [professionalTypeList,setProfessionalTypeList] = useState([]);
  const [form] = Form.useForm()
  const [error, setError] = useState([])
  const [unitTree, setUnitTree] = useState(orgTree)
  const [jobList, setJobList] = useState([])
  const [jobSelectLevel, setJobSelectLevel] = useState(jobLevel)
  const [nativePlaces, setNativePlaces] = useState([])
  const [fileName, setFileName] = useState(null)
  const [isShow,setIsShow] = useState(false)
  const [isHireShow,setIsHireShow] = useState(false)
  const [istx,setIstx] = useState(true)
  const [imageList,setImageList] = useState({})
  const [resInfo, setResInfo] = useState({})


  const fileProps = {
    name: 'file',
    // listType:"picture-card",
    action: getUploadUrl(),
    data: { name: fileName,catlog:'personal'},
    beforeUpload (file) {
      if (file.size/1024 > 10000) {
        message.error(`上传文件大小不能超过10M！`);
        return false;
      }
      setFileName(file.name)
    },

  }

  useEffect(() => {
    getProfessionstyle().then(res =>{
      setProfessionalTypeList(res);
    });
    reloadData()
    getNativeplaceList()
  }, [infoModel])

  const getNativeplaceList = () => {
    getNativeplace().then((res = []) => {
      setNativePlaces(res)
    })
  }

  const reloadData = () => {
    getEmployeeById(employeeId).then((res)=>{
      setResInfo(res)
      let data = {
        ...res,
        birthday: res.birthday ? moment(res.birthday) : undefined,
        beginworkdate: res.beginworkdate ? moment(res.beginworkdate) : undefined,
        hiredate: res.hiredate ? moment(res.hiredate) : undefined,
        orgId: res.orgId ? parseInt(res.orgId) : undefined,
        unitId: res.unitId ? parseInt(res.unitId) : undefined,
        isManagementTrainee:parseInt(res.isManagementTrainee),
        positionStar:parseInt(res.positionStar)
      }
      if (data) {
        let { nativeplaceProvince, ...resData } = data
        const item = findItemByTree(orgTree, data.orgId)
        setUnitTree(item ? item.children : [])
        data.unitId && getJobByOrgId(data.unitId).then((res) => {
          setJobList(res)
        })
        if (data.jobLevelType === '2') {
          setJobSelectLevel(jobLevel.filter(e => e.type === 'CODE_MANAGEMENTRANK'))
        } else if (data.jobLevelType === '1') {
          setJobSelectLevel(jobLevel.filter(e => e.type === 'CODE_PROFESSIONALRANK'))
        }
        let status = parseInt(data.status)
        if (status === 0 || status === 1 || status === 6) {
          setIsShow(false)
        } else {
          setIsShow(true)
        }
        if (status === 2) {
          setIsHireShow(true)
        }
        setImageList({
          photoUrl: data.photoUrl ? [{ uid: '1', name: data.photoUrl.split('----')[1], status: 'done', url: data.photoUrl }] : [],
          idcardImgs: data.idcardImgs ? data.idcardImgs.map((item,index)=>({ uid: index, name: item.split('----')[1], status: 'done', url: item })) : [],
          dimissionUrl: data.dimissionUrl ? [{ uid: '1', name: data.dimissionUrl.split('----')[1], status: 'done', url: data.dimissionUrl }] : [],
          graduationUrl: data.graduationUrl ? [{ uid: '1', name: data.graduationUrl.split('----')[1], status: 'done', url: data.graduationUrl }] : [],
          degreeUrl: data.degreeUrl ? [{ uid: '1', name: data.degreeUrl.split('----')[1], status: 'done', url: data.degreeUrl }] : [],
          healthUrl: data.healthUrl ? [{ uid: '1', name: data.healthUrl.split('----')[1], status: 'done', url: data.healthUrl }] : [],
          oldSalaryRecordUrl: data.oldSalaryRecordUrl ? data.oldSalaryRecordUrl.map((item,index)=>({ uid: index, name: item.split('----')[1], status: 'done', url: item })) : [],
          credential: data.credential ? data.credential.map((item,index)=>({ uid: index, name: item.split('----')[1], status: 'done', url: item })) : [],
          attachments: data.attachments ? data.attachments.map((item,index)=>({ uid: index, name: item.split('----')[1], status: 'done', url: item })) : [],
        })
        form.setFieldsValue({ ...resData})
      }
    })
  }


  const getErrorInfo = (errors) => {
    const errorCount = errors.filter((item) => item.errors.length > 0).length

    if (!errors || errorCount === 0) {
      return null
    }

    const scrollToField = (fieldKey) => {
      const labelNode = document.querySelector(`label[for="${fieldKey}"]`)

      if (labelNode) {
        labelNode.scrollIntoView(true)
      }
    }

    const errorList = errors.map((err) => {
      if (!err || err.errors.length === 0) {
        return null
      }
      const key = err.name[0]
      return (
        <li key={key} className={styles.errorListItem} onClick={() => scrollToField(key)}>
          <CloseCircleOutlined className={styles.errorIcon}/>
          <div className={styles.errorMessage}>{err.errors[0]}</div>
        </li>
      )
    })

    return (
      <span className={styles.errorIcon}>
        <Popover
          title="表单校验信息"
          content={errorList}
          overlayClassName={styles.errorPopover}
          trigger="click"
          getPopupContainer={(trigger) => {
            if (trigger && trigger.parentNode) {
              return trigger.parentNode
            }
            return trigger
          }}
        >
          <CloseCircleOutlined/>
        </Popover>
        {errorCount}
      </span>
    )
  }

  const onFinish = (values) => {
    let { ...data } = values;
    setError([])
    dispatch({
      type: 'infoAndEdit/updateMainInfo',
      payload: {
        ...data,
        oid: employeeId,
        updateHireDate: moment(resInfo.hiredate).format('YYYY-MM-DD'),
        photoUrl:imageList.photoUrl[0]?.response || imageList.photoUrl[0]?.url,
        idcardImgs:imageList.idcardImgs?.map(item=>item.response || item.url),
        dimissionUrl:imageList.dimissionUrl[0]?.response || imageList.dimissionUrl[0]?.url,
        graduationUrl:imageList.graduationUrl[0]?.response || imageList.graduationUrl[0]?.url,
        degreeUrl:imageList.degreeUrl[0]?.response || imageList.degreeUrl[0]?.url,
        healthUrl:imageList.healthUrl[0]?.response || imageList.healthUrl[0]?.url,
        oldSalaryRecordUrl:imageList.oldSalaryRecordUrl?.map(item=>item.response || item.url),
        credential:imageList.credential?.map(item=>item.response || item.url),
        attachments:imageList.attachments?.map(item=>item.response || item.url),
      },
    })
    history.goBack()
  }

  const onFinishFailed = (errorInfo) => {
    setError(errorInfo.errorFields)
  }

  const filterOption = (input, option) => {
    return option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
  }

  const onChangeOrgId = (e) => {
    form.setFieldsValue({ unitId: undefined, jobId: undefined })
    const item = findItemByTree(orgTree, e)
    setUnitTree(item ? item.children : [])
  }

  const onChangeUnitId = (e) => {
    form.setFieldsValue({ jobId: undefined })
    getJobByOrgId(e).then((res) => {
      setJobList(res)
    })
  }

  const onChangeJobId = (value) => {
    findTiaoxinTixiByJobId(value).then(res => {
      form.setFieldsValue({jobSystemId: res.C_TIXI, lineId: res.C_TIAOXIAN})
    })
  }

  const onChangeJobLevelType = (e) => {
    form.setFieldsValue({ jobLevelId: undefined })
    if (e === 2) {
      setJobSelectLevel(jobLevel.filter(e => e.type === 'CODE_MANAGEMENTRANK').reverse())
    } else {
      setJobSelectLevel(jobLevel.filter(e => e.type === 'CODE_PROFESSIONALRANK').reverse())
    }
  }

  const uploadButton = (
    <Button icon={<UploadOutlined />}>点击上传文件</Button>
    /*<div>
      <PlusOutlined />
      <div style={{ marginTop: 8 }}>上传图片</div>
    </div>*/
  );

  const onChangeImageList = (e, name) => {
    setImageList({
      ...imageList,
      [name]:e.fileList
    })
  }

  return (
    resInfo.oid ?
      <Form
        form={form}
        layout="vertical"
        hideRequiredMark
        initialValues={info}
        onFinish={onFinish}
        onFinishFailed={onFinishFailed}
      >
        <div className='info-edit'>
          <PageHeaderWrapper title={resInfo.name}>
            <Card title="基本信息" className={styles.card} bordered={false}>
              <Row gutter={24}>
                <Col {...colStyle}>
                  <FormItem label={'姓名'} name="name">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'性别'} name="gender">
                    <Select placeholder="请选择">
                      {genderList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'身份证'} name="idcard">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'民族'} name="nationality">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {nationList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'籍贯'} name="nativeplace" rules={[{required: true, message: '籍贯不能为空'}]}>
                    <Input placeholder="请输入籍贯"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'国籍'} name="nation">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {regionList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'政治面貌'} name="polity">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {inOrgList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'户口所在地'} name="regresidence">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'家庭住址'} name="address">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'健康状态'} name="healthstatus">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {healthsList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'电子邮箱'} name="privatemail">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'生日'} name="birthday">
                    <DatePicker placeholder="请选择日期" style={{ width: '100%' }}/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'手机'} name="mobile">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'参加工作时间'} name="beginworkdate">
                    <DatePicker placeholder="请选择日期" style={{ width: '100%' }}/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'婚姻状况'} name="marital">
                    <Select placeholder="请选择">
                      {maritalList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'是否退伍兵'} name="disbandment">
                    <Select placeholder="请选择">
                      {yesOrNoList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'退伍军人编号'} name="veteranNum">
                    <Input placeholder="请输入退伍军人编号"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'用工类型'} name="jobType">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {employeeTypeList.map((item, index) => {
                        return (
                          <Option value={`${item.value}`} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem name="laborContractYears" label="合同期限" rules={[{required: true, message: '合同期限不能为空'}]}>
                    <Select placeholder="请选择合同期限">
                      {laborContractYearsList.map((item, index) => {
                        return (
                          <Option value={item.value} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
              </Row>
            </Card>

            <Card title="任职信息" className={styles.card} bordered={false}>
              <Row gutter={16}>
                <Col {...colStyle}>
                  <FormItem label={'公司'} name="orgId">
                    <TreeSelect disabled={!editAllInfo} treeData={orgTree} onChange={onChangeOrgId}/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'部门'} name="unitId">
                    <TreeSelect disabled={!editAllInfo} treeData={unitTree} onChange={onChangeUnitId}/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'职位'} name="jobId">
                    <Select placeholder="请选择" disabled={!editAllInfo} showSearch onChange={onChangeJobId} filterOption={filterOption}>
                      {jobList.map((item, index) => {
                        return (
                          <Option value={`${item.coidassignedjob}`} key={item.coidassignedjob}>
                            {item.cname}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'工作地点'} name="workAddress">
                    <Input disabled={!editAllInfo} placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem name="jobSystemId" label="体系">
                    <Select disabled={!editAllInfo} placeholder="请选择" showSearch filterOption={filterOption}>
                      {orgSystem.map((item, index) => {
                        return (
                          <Option value={item.id} key={item.id}>
                            {item.name}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem name="lineId" label="条线">
                    <Select disabled={!editAllInfo} placeholder="请选择" showSearch filterOption={filterOption}>
                      {orgLine.map((item, index) => {
                        return (
                          <Option value={`${item.id}`} key={item.id}>
                            {item.name}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'工号'} name="code">
                    {/*<Input disabled={isShow} placeholder="请输入"/>*/}
                    <Input disabled={!editAllInfo} placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem name="jobLevelType" label="职级类型">
                    <Select disabled={!editAllInfo} placeholder="请选择" showSearch filterOption={filterOption}
                            onChange={onChangeJobLevelType}>
                      {jobLevelTypeList.map((item, index) => {
                        return (
                          <Option value={item.value} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem name="jobLevelId" label="职级">
                    <Select disabled={!editAllInfo} placeholder="请选择" showSearch filterOption={filterOption}>
                      {
                        jobLevel.map((item, index) => {
                          return (
                            <Option value={item.id} key={item.name}>
                              {item.name}
                            </Option>
                          )
                        })
                      }
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'入职日期'} name="hiredate">
                    <DatePicker disabled={isHireShow} placeholder="请选择日期" style={{ width: '100%' }}/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem name="probationday" label="试用期" rules={[{required: true, message: '试用期不能为空'}]}>
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {probationDayList.map((item, index) => {
                        return (
                          <Option value={item.value} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem name="professionalType" label="专业类型" rules={[{required: true, message: '专业类型不能为空'}]}>
                    <TreeSelect treeData={professionalTypeList} placeholder="请选择专业类型"/>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem name="reinstatement" label="是否复职" rules={[{required: true, message: '是否复职不能为空'}]}>
                    <Select placeholder="请选择">
                      {yesOrNoList.map((item, index) => {
                        return (
                          <Option value={item.value} key={index}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem name="iscentreprincipal" label="是否中心负责人" rules={[{required: true, message: '是否中心负责人不能为空'}]}>
                    <Select placeholder="请选择">
                      {yesOrNoList.map((item, index) => {
                        return (
                          <Option value={item.value} key={index}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem name="isdepartmentprincipa" label="是否部门负责人" rules={[{required: true, message: '是否部门负责人不能为空'}]}>
                    <Select placeholder="请选择">
                      {yesOrNoList.map((item, index) => {
                        return (
                          <Option value={item.value} key={index}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem label='档案所在地' name="recordFileAddress">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem label='档案编号' name="fileNumber">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>
                <Col {...colStyle}>
                  <FormItem label='岗位星级' name="positionStar">
                    <Select placeholder="请选择">
                      {positionStarList.map((item, index) => {
                        return (
                          <Option value={item.value} key={index}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>
              </Row>
            </Card>

            <Card title="招聘信息" className={styles.card} bordered={false}>
              <Row gutter={16}>
                <Col {...colStyle}>
                  <FormItem name="socialTrainee" label="招聘类型">
                    <Select placeholder="请选择">
                      {socialTraineeStateArray.map((item, index) => {
                        return (
                          <Option value={`${index}`} key={index}>
                            {item}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem name="isManagementTrainee" label="是否管培生">
                    <Select placeholder="请选择">
                      {yesOrNoIntList.map((item, index) => {
                        return (
                          <Option value={item.value} key={item.value}>
                            {item.label}
                          </Option>
                        )
                      })}
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'招聘渠道'} name="channel">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {
                        channelList.map((item, index) => {
                          return (
                            <Option value={`${item.value}`} key={item.value}>
                              {item.label}
                            </Option>
                          )
                        })
                      }
                    </Select>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'推荐人(内部)'} name="innerReferrer">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'推荐人(外部)'} name="outerReferrer">
                    <Input placeholder="请输入"/>
                  </FormItem>
                </Col>

                <Col {...colStyle}>
                  <FormItem label={'招聘网站'} name="recruitmentWeb">
                    <Select placeholder="请选择" showSearch filterOption={filterOption}>
                      {
                        websiteList.map((item, index) => {
                          return (
                            <Option value={item.value} key={item.value}>
                              {item.label}
                            </Option>
                          )
                        })
                      }
                    </Select>
                  </FormItem>
                </Col>
              </Row>
            </Card>

            <Card title="教育经历" bordered={false} style={{ marginBottom: 24 }}>
              <FormItem name="employeeEducation">
                <EducationTableForm employeeId={employeeId}/>
              </FormItem>
            </Card>

            <Card title="工作经历" bordered={false} style={{ marginBottom: 24 }}>
              <FormItem name="employeeSociety">
                <SocietyTableForm employeeId={employeeId}/>
              </FormItem>
            </Card>

            <Card title="行政党派信息" bordered={false} style={{ marginBottom: 24 }}>
              <FormItem name="employeeInorgname">
                <InOrgNameTableForm employeeId={employeeId}/>
              </FormItem>
            </Card>

            <Card title="家庭成员信息" bordered={false} style={{ marginBottom: 24 }}>
              <FormItem name="familyMember">
                <FamilyTableForm employeeId={employeeId}/>
              </FormItem>
            </Card>

            <Card title="关系报备" bordered={false} style={{ marginBottom: 24 }}>
              <FormItem name="RelativeRecordsEntity">
                <RelativeRecords oid={resInfo.oid}/>
              </FormItem>
            </Card>

            <Card title="内部奖惩" bordered={false} style={{ marginBottom: 24 }}>
              <FormItem name="InternalAwardEntity">
                <InternalAwardTable oid={resInfo.oid} empCode={resInfo.code}/>
              </FormItem>
            </Card>

            <Card title="附件信息" bordered={false} >
              <Row gutter={24}>
                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='个人一寸照片'>
                    <Upload {...fileProps} fileList={imageList.photoUrl} onChange={e=>onChangeImageList(e,'photoUrl')} >
                      { (!imageList.photoUrl || imageList.photoUrl.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='身份证正反面照片'>
                    <Upload {...fileProps} fileList={imageList.idcardImgs} onChange={e=>onChangeImageList(e,'idcardImgs')} >
                      { (!imageList.idcardImgs || imageList.idcardImgs.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='离职证明'>
                    <Upload {...fileProps} fileList={imageList.dimissionUrl} onChange={e=>onChangeImageList(e,'dimissionUrl')} >
                      { (!imageList.dimissionUrl || imageList.dimissionUrl.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='毕业证'>
                    <Upload {...fileProps} fileList={imageList.graduationUrl} onChange={e=>onChangeImageList(e,'graduationUrl')} >
                      { (!imageList.graduationUrl || imageList.graduationUrl.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='学位证'>
                    <Upload {...fileProps} fileList={imageList.degreeUrl} onChange={e=>onChangeImageList(e,'degreeUrl')} >
                      { (!imageList.degreeUrl || imageList.degreeUrl.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='体检报告'>
                    <Upload {...fileProps} fileList={imageList.healthUrl} onChange={e=>onChangeImageList(e,'healthUrl')} >
                      { (!imageList.healthUrl || imageList.healthUrl.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='银行流水/薪资证明'>
                    <Upload {...fileProps} fileList={imageList.oldSalaryRecordUrl} onChange={e=>onChangeImageList(e,'oldSalaryRecordUrl')} >
                      { (!imageList.oldSalaryRecordUrl || imageList.oldSalaryRecordUrl.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='职称证书'>
                    <Upload {...fileProps} fileList={imageList.credential} onChange={e=>onChangeImageList(e,'credential')} >
                      { (!imageList.credential || imageList.credential.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>

                <Col span={8}>
                  <FormItem labelAlign='right' lablecol={7} label='其他附件'>
                    <Upload {...fileProps} fileList={imageList.attachments} onChange={e=>onChangeImageList(e,'attachments')} >
                      { (!imageList.attachments || imageList.attachments.length < 1) && uploadButton }
                    </Upload>
                  </FormItem>
                </Col>
              </Row>
            </Card>

          </PageHeaderWrapper>
        </div>
        <FooterToolbar>
          {getErrorInfo(error)}
          <Button type="primary" size="large" onClick={() => history.goBack()}>返回</Button>
          <Button type="primary" size="large" onClick={() => form?.submit()} loading={submitting}>保存</Button>
        </FooterToolbar>
      </Form> : <div className='spin-block'><Spin size="large"/></div>
  )
}

export default connect(({ user,infoAndEdit, infoModel, loading }) => ({
  infoModel,
  infoAndEdit,
  currentUser: user.currentUser,
  submitting: loading.effects['infoAndEdit/updateMainInfo'],
}))(Edit)
